<template>
  <div>
    <van-swipe class="main-swiper" :autoplay="3000" :show-indicators="false">
      <van-swipe-item v-for="(item,index) in banners" :key="'loop'+index">
        <img class="main-swiper-image" :src="item.loopUrl" alt="">
      </van-swipe-item>
    </van-swipe>
    <van-tabbar route>
      <van-tabbar-item replace to="/index" icon="home-o">首页</van-tabbar-item>
      <van-tabbar-item replace to="/account" icon="friends-o">我的</van-tabbar-item>
    </van-tabbar>
  </div>
</template>

<script>
import $ from 'jquery'
import {PageHeader, PageFooter} from '../../components/common'

export default {
  name: 'Home',
  data(){
    return {
      banners:[
        {
          id:1,
          loopUrl:'https://wxm.tsingtao.com.cn/cdn1/2022/10/28/20221028164439_476.jpg'
        },
        {
          id:2,
          loopUrl:'https://wxm.tsingtao.com.cn/cdn1/2022/11/14/20221114224703_557.jpg'
        },
        {
          id:3,
          loopUrl:'https://wxm.tsingtao.com.cn/cdn1/2022/09/13/20220913225150_175.jpg'
        },
        {
          id:4,
          loopUrl:'https://wxm.tsingtao.com.cn/cdn1/2022/11/14/20221114225444_238.jpg'
        },
      ]
    }

  },
  components: {PageHeader, PageFooter},
  mounted(){
    let bodyHeight = $(document).height()-100
    $('.content').css('min-height',bodyHeight)
  }
}
</script>

<style scoped>
/* @import 引入仍为全局样式 */
@import "../../assets/css/style.css";
</style>
